<template>
	<view>
		<view v-show="key!=''">{{key}}的搜索结果</view>
		<view v-show="category!=''">{{category}}</view>
		<view class="cart">
			<view @click="addToCart()">
				<view>购物车</view>
			</view>
		</view>
		<view v-if="goods.length!=0">
			<view v-for="(item,key) in goods" :key="key">
				<uni-list>
					<uni-list-item :thumb="item['goodspicture']" thumbSize="base">
						<template slot="body" class="temp" @tap="getClicked(item['goodsid'])">
							<text class="temp_text1">名称：{{item['goodsname']}}</text>
							<text class="temp_text2">价格：{{item['goodsprice']}}</text>
							<text class="temp_text3" v-if="userType===1">库存：{{item['goodsstock']}}</text>
							<text class="temp_text4">规格：{{item['goodsstandard']}}</text>
						</template>
						<template slot="footer" class="add">
							<view v-if="item['purchasenum']===0" @click="change_purchasenum(key,1)">
								<view>+</view>
								<!-- <view  :animation="animationData" style="background:red;height:10px;width:10px;border-radius: 5px;"></view> -->
							</view>
							<view v-else class="add_box">
								<view @click="change_purchasenum(key,-1)" class="oprator">-</view>
								<!-- {{item['purchasenum']}} -->
								<input :value="goods[key]['purchasenum']" class="input-my"
									@input="inputChange($event,key)" />
								<view @click="change_purchasenum(key,1)" class="oprator">+</view>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				key: "",
				category: "",
				goods: [],
				src: "../../../../../static/default_goods.png",
				isShow: true,
				cart_list: []
			}
		},
		computed: mapState(['hasLogin', 'userName','userType','purchaseNumberList']),
		methods: {
			...mapMutations(['changeCart']),
			getClicked(id) {
				console.log(id);
				uni.navigateTo({
					url: '/pages/tabBar/main/cusCertainGoods/cusCertainGoods',
					success: (response) => {
						console.log(response);
						response.eventChannel.emit('gerGoodsInfo', {
							goodsid: id
						})
					}
				})
			},
			inputChange(e, key) {
				// console.log(e);
				if (Number(e.detail.value) > this.goods[key]['goodsstock']) {
					uni.showToast({
						title: '太多啦',
						icon: 'none'
					});
					this.goods[key]['purchasenum'] = 0;
				} else if (Number(e.detail.value) == 0) {
					this.goods[key]['purchasenum'] = 0;
				} else {
					this.goods[key]['purchasenum'] = Number(e.detail.value);
				}
				this.changeCart(this.goods[key])
			},
			change_purchasenum(key, num) {
				this.goods[key]['purchasenum'] = Number(this.goods[key]['purchasenum'])
				if (this.goods[key]['purchasenum'] < this.goods[key]['goodsstock']) {
					this.goods[key]['purchasenum'] += num
				} else if (this.goods[key]['purchasenum'] == this.goods[key]['goodsstock']) {
					if (num == 1) {
						uni.showToast({
							title: '不能再多啦',
							icon: 'none'
						});
					} else if (num == -1) {
						this.goods[key]['purchasenum'] += num;
					}
				}
				this.changeCart(this.goods[key])
			},
			addToCart() {
				for (let index = 0; index < this.goods.length; index++) {
					if (this.goods[index]['purchasenum'] > 0) {
						this.cart_list.push(this.goods[index])
					}
				}
				uni.navigateTo({
					url: '/pages/cart/cart?cartlist=' + encodeURIComponent(JSON.stringify(this.cart_list)),
					events: {
						// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
						emptyShoppingCart: (data) => {
							for (var index = 0; index < this.goods.length; index++) {
								this.goods[index]['purchasenum'] = 0;
							}
							console.log(this.goods)
						}
					},
					success: (res) => {
						console.log(res)
						this.cart_list = []
					}
				})
			}
		},
		onLoad(option) {
			console.log(this.userType);
			let name = option.name;
			let data = {};
			let url = ''
			if (name == 'category') {
				this.category = option.search;
				url = '/product/getmore_goodsinfo/';
				data = {
					'category': this.category
				};
			} else if (name == 'search') {
				this.key = option.search;
				url = '/users/search_info/'
				data = {
					'key': this.key
				};
			}
			console.log(data)
			this.$myRequest({
				url: url,
				data: data
			}).then(response => {
				console.log(response);
				if (response.data === "缺货啦，联系店家试试吧~") {
					this.isShow = false;
				} else {
					this.goods = response.data
					let index;
					for (index = 0; index < response.data.length; index++) {
						this.$set(this.goods[index], 'purchasenum', 0);
						let item = response.data[index]
						this.$myRequest({
							url: '/product/get_pict_url/',
							data: {
								"id": item['goodsid']
							}
						}).then(res => {
							if (res.data.length == 0) {
								item.goodspicture = this.src;
							} else {
								item.goodspicture = res.data[0];
							}
							const eventChannel = this.getOpenerEventChannel();
							eventChannel.on('syncPurchaseNum', (data) => {
								this.cart_list = data.cart_list;
								console.log(this.purchaseNumberList)
								if(this.purchaseNumberList.length!=0){
									for(var i=0;i<this.purchaseNumberList.length;i++){
										for(var j=0;j<this.goods.length;j++){
											if(this.goods[j]['goodsid']===this.purchaseNumberList[i].goodsid){
												this.$set(this.goods[j],'purchasenum',this.purchaseNumberList[i].purchasenum)
											}
										}
									}
								}
								for (var i = 0; i < this.cart_list.length; i++) {
									console.log(this.cart_list[i]['goodsid']);
									console.log(this.goods)
									for (var j = 0; j < this.goods.length; j++) {
										console.log(this.goods[j]['goodsid']);
										if (this.cart_list[i]['goodsid'] === this.goods[j][
												'goodsid'
											]) {
											console.log('true');
											this.$set(this.goods[j], 'purchasenum', this.cart_list[
												i]['purchasenum']);
											break;
										}
									}
								}
								this.cart_list=[]
							});
						})
					}
				}
			});

		},
		onUnload() {
			console.log('onUnload');
			const eventChannel = this.getOpenerEventChannel();
			eventChannel.emit('emptyKeyWord', {
				data: 'emptyKeyWord'
			});
			for(var i=0;i<this.goods.length;i++){
				if(this.goods[i]['purchasenum']!=0){
					this.cart_list.push(this.goods[i])
				}
			}
			eventChannel.emit('syncCartList',{
				cart_list:this.cart_list
			})
			this.cart_list=[];
		},
		onHide(){
			this.cart_list=[];
			console.log('onHide');
		}
	}
</script>

<style lang="scss">
	.temp {
		.temp_text1 {
			width: 100px;
			margin-right: 10px;
			display: inline-block;
		}

		.temp_text2 {
			width: 100px;
			margin-right: 10px;
			display: inline-block;

		}

		.temp_text3 {
			width: 100px;
			margin-right: 10px;
			display: inline-block;
		}

		.temp_text4 {
			color: #8F8F94;
			width: 250px;
			margin-right: 10px;
			display: inline-block;
			// overflow: hidden；
			// white-space: nowrap；
			// text-overflow: ellipsis；
			overflow: hidden;
			-webkit-line-clamp: 1;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-box-orient: vertical;
		}
	}

	.cart {
		position: fixed;
		// top: 1050rpx;
		bottom: 0;
		z-index: 99;
		height: 30px;
		width: 100%;
		text-align: center;
		background: green;
	}
</style>
